<!DOCTYPE html>
<html>
    <head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>通话管理- 通话记录列表</title>
	<meta name="keywords" content="">
	<meta name="description" content="">
	<link rel="shortcut icon" href="../favicon.ico">
	<link href="__PUBLIC__/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
	<link rel="stylesheet" href="__PUBLIC__/css/ace.min.css" />
	<link href="__PUBLIC__/css/font-awesome.css?v=4.4.0" rel="stylesheet">
	<link href="__PUBLIC__/css/animate.css" rel="stylesheet">
	<link href="__PUBLIC__/css/style.css?v=4.1.0" rel="stylesheet">
	<script src="__PUBLIC__/js/plugins/layer/laydate/laydate.js"></script>
	<style>
	    .table-container{
		overflow:auto;
	    }
	    .img{ max-width: 64px; max-height: 64px; }
	    .left{ text-align: left !important; }
	    .right{ text-align: right !important; }
	    .btn-default{ cursor: text; }
	</style>
    </head>
    <body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight">
	    <div class="row">
		<div class="col-sm-12">
		    <div class="ibox float-e-margins">
			<div class="ibox-title">
			    <h5>通话管理- <small>通话记录列表</small>
			    </h5>
			    <div class="ibox-tools">
			    </div>
			</div>
			<div class="ibox-content">
			    <div class="dataTables_filter">
				<form action="__SELF__" id="form1">
				    <if condition="$app_code eq ''">
					<label>
					    <select name="ddlapp" id="ddlapp" onchange="form_submit()">
						<option value="0">-项目-</option>
						<volist name="apparr" id="apparr">
						    <option value="<{$apparr.app_flag}>" <if condition="$search.appsel eq $apparr['app_flag']">selected</if>><{$apparr.app_name}></option>
						</volist>
					    </select>
					</label>&nbsp;&nbsp;
				    </if>
				    <div class="btn-group" id="btngroup">
					<button type="button" id="btnall" name="btnall" value="0" class="btn <{$btntimeclass.all}> btn-all" onclick="form_btntime_submit(this)">全部</button>
					<button type="button" id="btnweek" name="btnweek" value="1" class="btn <{$btntimeclass.week}> btn-week" onclick="form_btntime_submit(this)">本周</button>
					<button type="button" id="btnlastweek" name="btnlastweek" value="2" class="btn <{$btntimeclass.lastweek}> btn-week" onclick="form_btntime_submit(this)">上周</button>
					<button type="button" id="btnmonth" name="btnmonth" value="3" class="btn <{$btntimeclass.month}> btn-month" onclick="form_btntime_submit(this)">本月</button>
					<button type="button" id="btnlastmonth" name="btnlastmonth" value="4" class="btn <{$btntimeclass.lastmonth}> btn-month" onclick="form_btntime_submit(this)">上月</button>
					<button type="button" id="btnquarter" name="btnquarter" value="5" class="btn <{$btntimeclass.quarter}> btn-quarter" onclick="form_btntime_submit(this)">本季度</button>
					<button type="button" id="btncustom" name="btncustom" value="1" class="btn btn-white btn-custom" title="自定义" onclick="form_timecustom(this)">></button>
				    </div>
				    <label id="labbegintime" style="display: none;">
					<input type="text" id="txtbegintime" name="txtbegintime" placeholder="请输入开始时间" readonly="readonly" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm'})" rel="<{$search.begintime}>" value="<{$search.begintime}>" />
				    </label>
				    <label id="labendtime" style="display: none;">
					<input type="text" id="txtendtime" name="txtendtime" placeholder="请输入结束时间" readonly="readonly" onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm'})" rel="<{$search.endtime}>" value="<{$search.endtime}>" />
				    </label>
				    <div class="btn-group" id="btngroupback" style="display: none;">
					<button type="button" id="btncustomback" name="btncustomback" value="0" class="btn btn-white btn-custom" title="返回" onclick="form_timecustom(this)"><</button>
				    </div>&nbsp;
				    <label>
					<select name="ddlcalltime" id="ddlcalltime" onchange="form_calltime_submit()">
					    <option value="0">-通话时长-</option>
					    <option value ="0-60" <if condition="$search.calltimesel eq '0-60'">selected</if>>01分钟以下</option>
					    <option value ="60-600" <if condition="$search.calltimesel eq '60-600'">selected</if>>01分钟至10分钟</option>
					    <option value ="600-1800" <if condition="$search.calltimesel eq '600-1800'">selected</if>>10分钟至30分钟</option>
					    <option value ="1800-3600" <if condition="$search.calltimesel eq '1800-3600'">selected</if>>30分钟至01小时</option>
					    <option value ="3600-0" <if condition="$search.calltimesel eq '3600-0'">selected</if>>01小时以上</option>
					</select>
				    </label>&nbsp;
				    <label>
					<!--					 <if condition="$search.recordsel eq 1">disabled="disabled"</if>-->
					<select name="ddlstate" id="ddlstate" onchange="form_state_submit()">
					    <option value="0">-状态-</option>
					    <volist name="statearr" id="statearr">
						<option value ="<{$statearr.value}>" <if condition="$search.statesel eq $statearr['value']">selected</if>><{$statearr.text}></option>
					    </volist>
					</select>
				    </label>&nbsp;
				    <label>
					<!--					 <if condition="$search.statesel eq 2">disabled="disabled"</if>-->
					<select name="ddlrecord" id="ddlrecord" onchange="form_record_submit()">
					    <option value="0">-是否录制-</option>
					    <volist name="recordarr" id="recordarr">
						<option value ="<{$recordarr.value}>" <if condition="$search.recordsel eq $recordarr['value']">selected</if>><{$recordarr.text}></option>
					    </volist>
					</select>
				    </label>
				    <label>
					<input type="text" id="txtkeyword" name="txtkeyword" value="<{$search.keyword}>" placeholder="请输入关键词" />&nbsp;
					<input type="submit" id="btnsearch" name="btnsearch" value="搜索" />
				    </label>
				    <input type="hidden" value="<{$timetype}>" id="hidtimetype" name="hidtimetype" />
				    <input type="hidden" value="<{$timeiscustom}>" id="hidtimeiscustom" name="hidtimeiscustom" />
				    <input type="hidden" value="<{$searchtype}>" id="hidsearchtype" name="hidsearchtype" />
				</form>
			    </div>
			    <table class="table table-striped table-bordered table-hover table-container">
				<thead>
				    <tr>
					<th width="150px;">创建时间</th>
					<th class="right">通话费用</th>
					<th width="150px;">通话时长</th>
					<th width="100px;">状态</th>
					<th width="100px;">是否录制</th>
					<th width="150px;">主叫头像</th>
					<th width="200px;" class="left">主叫信息</th>
					<th width="150px;">被叫头像</th>
					<th width="200px;" class="left">被叫信息</th>
					<th width="200px;" class="left">操作</th>
				    </tr>
				</thead>
				<tbody>
				<volist name="data" id="vo">
				    <tr id="<{$vo.id}>">
					<td><{$vo.ctime}></td>
					<td class="right"><if condition="$vo.state eq 1"><{$vo.money_text}></if></td>
				    <td><if condition="$vo.state eq 1"><{$vo.calltime_text}></if></td>
				    <td><{$vo.state_text}></td>
				    <td><{$vo.is_record_text}></td>
				    <td><if condition="$vo.user_uid neq null && $vo.user_uid neq ''"><img alt='未找到图片' class="img" src="<{$vo.user_logo}>"/></if></td>
				    <td class="left"><if condition="$vo.user_uid neq null && $vo.user_uid neq ''"><{$vo.caller_info}></if></td>
				    <td><if condition="$vo.user_uid_callee neq null && $vo.user_uid_callee neq ''"><img alt='未找到图片' class="img" src="<{$vo.user_logo2}>"/></if></td>
				    <td class="left"><if condition="$vo.user_uid_callee neq null && $vo.user_uid_callee neq ''"><{$vo.callee_info}></if></td>
				    <td class="operate left">
				    <if condition="$vo.is_record eq 1 && $vo.state eq 1">
					<if condition="$vo.video_url neq null && $vo.video_url neq ''"><a class="btn btn-info btn-rounded" href="<{$vo.video_url}>" target="_blank" title="主叫回放">主叫回放</a><else/><a class="btn btn-default btn-rounded" href="javascript:void(0);" title="视频录制有延时，请稍后刷新列表">主叫回放</a></if>
					<if condition="$vo.video_url_ee neq null && $vo.video_url_ee neq ''"><a class="btn btn-info btn-rounded" href="<{$vo.video_url_ee}>" target="_blank" title="被叫回放">被叫回放</a><else/><a class="btn btn-default btn-rounded" href="javascript:void(0);" title="视频录制有延时，请稍后刷新列表">被叫回放</a></if>
				    </if>
				    </td>
				    </tr>
				</volist>
				<if condition="($total eq null) or ($total eq 0)">
				    <tr><td colspan="20">没有数据</td></tr>
				</if>
				</tbody>
			    </table>
			    <div class="dataTables_paginate paging_simple_numbers">
				<ul class="pagination">
				    <if condition="$total gt 0">
					<{$fpage}>
				    </if>
				</ul>
			    </div>
			</div>
		    </div>
		</div>
	    </div>
	</div>
	<!-- 全局js -->
	<script src="__PUBLIC__/js/jquery.min.js?v=2.1.4"></script>
	<script src="__PUBLIC__/js/bootstrap.min.js?v=3.3.6"></script>
	<!-- 自定义js -->
	<script src="__PUBLIC__/js/content.js?v=1.0.0"></script>
	<script src="__PUBLIC__/js/plugins/layer/layer.min.js"></script>
	<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
	<script>
					    var $btngroup = $("#btngroup");
					    var $btngroupback = $("#btngroupback");
					    var $hidsearchtype = $("#hidsearchtype");
					    var $hidtimetype = $("#hidtimetype");
					    var $hidtimeiscustom = $("#hidtimeiscustom");
					    var $labbegintime = $("#labbegintime");
					    var $labendtime = $("#labendtime");
					    var $txtbegintime = $("#txtbegintime");
					    var $txtendtime = $("#txtendtime");
					    var timetype = $hidtimetype.val();
					    var timeiscustom = parseInt($hidtimeiscustom.val(), 10);
					    if (timeiscustom) {
						form_timecustom($("#btncustom")[0]);
					    } else {
						form_timecustom($("#btncustomback")[0]);
					    }
					    function form_state_submit() {
						$hidsearchtype.val("1");
						form_submit();
					    }
					    function form_record_submit() {
						$hidsearchtype.val("2");
						form_submit();
					    }
					    function form_calltime_submit() {
						$hidsearchtype.val("3");
						form_submit();
					    }
					    function form_btntime_submit(obj) {
						var $obj = $(obj);
						var val = $obj.val();
						selecttime(val, $txtbegintime, $txtendtime);
						form_submit();
					    }
					    function form_submit() {
						document.getElementById("form1").submit();
					    }
					    function form_timecustom(obj) {
						var $obj = $(obj);
						var val = parseInt($obj.val(), 10);
						$hidtimeiscustom.val(val);
						if (val) {
						    $labbegintime.show();
						    $labendtime.show();
						    $btngroupback.show();
						    $btngroup.hide();
						} else {
						    if (timetype) {
							$txtbegintime.val($txtbegintime.attr("rel"));
							$txtendtime.val($txtendtime.attr("rel"));
						    }
						    $labbegintime.hide();
						    $labendtime.hide();
						    $btngroupback.hide();
						    $btngroup.show();
						}
					    }

					    function selecttime(type, $txtbegintime, $txtendtime) {
						$hidtimetype.val(type);
						var begintime = '';
						var endtime = '';
						switch (type) {
						    case '1':
							begintime = getWeekStartDate();
							endtime = getWeekEndDate();
							break;
						    case '2':
							begintime = getLastWeekStartDate();
							endtime = getLastWeekEndDate();
							break;
						    case '3':
							begintime = getMonthStartDate();
							endtime = getMonthEndDate();
							break;
						    case '4':
							begintime = getLastMonthStartDate();
							endtime = getLastMonthEndDate();
							break;
						    case '5':
							begintime = getQuarterStartDate();
							endtime = getQuarterEndDate();
							break;
						    default:
							begintime = '';
							endtime = '';
							break;
						}
						if (begintime != "") {
						    begintime = begintime + " 00:00";
						}
						if (endtime != "") {
						    endtime = endtime + " 00:00";
						}
						$txtbegintime.attr("rel", begintime).val(begintime);
						$txtendtime.attr("rel", endtime).val(endtime);
					    }

					    /**
					     * 获取本周、本季度、本月、上月的开始日期、结束日期
					     */
					    var now = new Date(); //当前日期
					    var nowDayOfWeek = now.getDay(); //今天本周的第几天
					    var nowDay = now.getDate(); //当前日
					    var nowMonth = now.getMonth(); //当前月
					    var nowYear = now.getYear(); //当前年
					    nowYear += (nowYear < 2000) ? 1900 : 0; //
					    var lastMonthDate = new Date(); //上月日期
					    lastMonthDate.setDate(1);
					    lastMonthDate.setMonth(lastMonthDate.getMonth() - 1);
					    var lastYear = lastMonthDate.getYear();
					    var lastMonth = lastMonthDate.getMonth();
					    //格式化日期：yyyy-MM-dd
					    function formatDate(date) {
						var myyear = date.getFullYear();
						var mymonth = date.getMonth() + 1;
						var myweekday = date.getDate();
						if (mymonth < 10) {
						    mymonth = "0" + mymonth;
						}
						if (myweekday < 10) {
						    myweekday = "0" + myweekday;
						}
						return (myyear + "-" + mymonth + "-" + myweekday);
					    }
					    //获得某月的天数
					    function getMonthDays(myMonth) {
						var monthStartDate = new Date(nowYear, myMonth, 1);
						var monthEndDate = new Date(nowYear, myMonth + 1, 1);
						var days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
						return days;
					    }
					    //获得本季度的开始月份
					    function getQuarterStartMonth() {
						var quarterStartMonth = 0;
						if (nowMonth < 3) {
						    quarterStartMonth = 0;
						}
						if (2 < nowMonth && nowMonth < 6) {
						    quarterStartMonth = 3;
						}
						if (5 < nowMonth && nowMonth < 9) {
						    quarterStartMonth = 6;
						}
						if (nowMonth > 8) {
						    quarterStartMonth = 9;
						}
						return quarterStartMonth;
					    }
					    //获得本周的开始日期
					    function getWeekStartDate() {
						var weekStartDate = new Date(nowYear, nowMonth, nowDay - nowDayOfWeek);
						return formatDate(weekStartDate);
					    }
					    //获得本周的结束日期
					    function getWeekEndDate() {
						var weekEndDate = new Date(nowYear, nowMonth, nowDay + (6 - nowDayOfWeek));
						return formatDate(weekEndDate);
					    }
					    //获得上周的开始日期
					    function getLastWeekStartDate() {
						var weekStartDate = new Date(nowYear, nowMonth, nowDay - nowDayOfWeek - 7);
						return formatDate(weekStartDate);
					    }
					    //获得上周的结束日期
					    function getLastWeekEndDate() {
						var weekEndDate = new Date(nowYear, nowMonth, nowDay - nowDayOfWeek - 1);
						return formatDate(weekEndDate);
					    }
					    //获得本月的开始日期
					    function getMonthStartDate() {
						var monthStartDate = new Date(nowYear, nowMonth, 1);
						return formatDate(monthStartDate);
					    }
					    //获得本月的结束日期
					    function getMonthEndDate() {
						var monthEndDate = new Date(nowYear, nowMonth, getMonthDays(nowMonth));
						return formatDate(monthEndDate);
					    }
					    //获得上月开始时间
					    function getLastMonthStartDate() {
						var lastMonthStartDate = new Date(nowYear, lastMonth, 1);
						return formatDate(lastMonthStartDate);
					    }
					    //获得上月结束时间
					    function getLastMonthEndDate() {
						var lastMonthEndDate = new Date(nowYear, lastMonth, getMonthDays(lastMonth));
						return formatDate(lastMonthEndDate);
					    }
					    //获得本季度的开始日期
					    function getQuarterStartDate() {
						var quarterStartDate = new Date(nowYear, getQuarterStartMonth(), 1);
						return formatDate(quarterStartDate);
					    }
					    //或的本季度的结束日期
					    function getQuarterEndDate() {
						var quarterEndMonth = getQuarterStartMonth() + 2;
						var quarterStartDate = new Date(nowYear, quarterEndMonth,
							getMonthDays(quarterEndMonth));
						return formatDate(quarterStartDate);
					    }
	</script>
    </body>
</html>
